React = require('react')
{WebView,Text,ScrollView,TouchableOpacity,Image} = require('react-native')

TopNotice = require('antd-mobile/lib/notice-bar')

Dimensions = require('Dimensions')
{ width, height } = Dimensions.get('window')
{View} = require('react-native')

{fetchGetList,fetchRefreshList} = require('../actions/page_planDetail.js')

_ = require('underscore')
moment = require('moment')
backImg = require('../img/back.png')

Page_ckblbg_detail = React.createClass
  componentDidMount:->
  _getType:(code)->
    array = [{"CHNO":"2197","VCSYSCODE":"chShipConditionType","VCSYSNAME":"船况不良类型","VCSYSVALUE":"1","VCSYSDESC":"引航员登离船装置不符合要求","NMSORT":"1","VCFLAG":"","VCGROUP":""},{"CHNO":"2198","VCSYSCODE":"chShipConditionType","VCSYSNAME":"船况不良类型","VCSYSVALUE":"2","VCSYSDESC":"主机故障","NMSORT":"2","VCFLAG":"","VCGROUP":""},{"CHNO":"2199","VCSYSCODE":"chShipConditionType","VCSYSNAME":"船况不良类型","VCSYSVALUE":"3","VCSYSDESC":"船舶失电","NMSORT":"3","VCFLAG":"","VCGROUP":""},{"CHNO":"2200","VCSYSCODE":"chShipConditionType","VCSYSNAME":"船况不良类型","VCSYSVALUE":"4","VCSYSDESC":"舵机故障","NMSORT":"4","VCFLAG":"","VCGROUP":""},{"CHNO":"2417","VCSYSCODE":"chShipConditionType","VCSYSNAME":"船况不良类型","VCSYSVALUE":"6","VCSYSDESC":"船员素质","NMSORT":"5","VCFLAG":"","VCGROUP":""},{"CHNO":"2217","VCSYSCODE":"chShipConditionType","VCSYSNAME":"船况不良类型","VCSYSVALUE":"5","VCSYSDESC":"其他","NMSORT":"6","VCFLAG":"","VCGROUP":""}]
    return (_.findWhere array,{VCSYSVALUE:code})?.VCSYSDESC
  render:->
    model = @props.model
    <View style={width:width,height:height,flexDirection:'column'}>
      <View style={{flexDirection:'row',flex:0,height:60,alignItems:'center', justifyContent:'center',backgroundColor:'#0066FF'}}>
        <View style={{flex:1,padding:10}}>
          <TouchableOpacity onPress={=>@props.navigator.pop()}>
            <Image source={backImg}  style={{height:30,width:30,resizeMode:'contain'}}/>
          </TouchableOpacity>
        </View>
        <View style={{flex:3,justifyContent:'center',alignItems:'center'}}>
          <Text style={{fontSize:20,color:'#ffffff'}}>{model.ZWCM}</Text>
        </View>
        <View style={{flex:1,alignItems:'flex-end',padding:10}}>
        </View>
      </View>
      <ScrollView style={{backgroundColor:'#fffff0',paddingTop:10,height:height-80}}>
        <View style={{flexDirection:'column',marginBottom:10}}>
          <View style={styles.row}>
            <View style={styles.cell}>
              <Text style={styles.text}>中文船名</Text>
              <Text style={styles.text}>{model.ZWCM}</Text>
            </View>
            <View style={styles.cell}>
              <Text style={styles.text}>英文船名</Text>
              <Text style={styles.text}>{model.YWCM}</Text>
            </View>
          </View>
          <View style={styles.row}>
            <View style={styles.cell}>
              <Text style={styles.text}>船舶呼号</Text>
              <Text style={styles.text}>{model.CBHH}</Text>
            </View>
            <View style={styles.cell}>
              <Text style={styles.text}>MMSI</Text>
              <Text style={styles.text}>{model.MMSI}</Text>
            </View>
          </View>
          <View style={styles.row}>
            <View style={styles.cell}>
              <Text style={styles.text}>船宽</Text>
              <Text style={styles.text}>{model.CK}</Text>
            </View>
            <View style={styles.cell}>
              <Text style={styles.text}>吃水</Text>
              <Text style={styles.text}>{model.CS}</Text>
            </View>
          </View>
          <View style={styles.row}>
            <View style={styles.cell}>
              <Text style={styles.text}>船公司</Text>
              <Text style={styles.text}>{model.CGS}</Text>
            </View>
            <View style={styles.cell}>
              <Text style={styles.text}>下一港</Text>
              <Text style={styles.text}>{model.XYG}</Text>
            </View>
          </View>
        </View>
        <View style={{flexDirection:'column',marginBottom:10}}>
          <View style={styles.row}>
            <View style={styles.cell}>
              <Text style={styles.text}>提交人</Text>
              <Text style={styles.text}>{model.JDR}</Text>
            </View>
            <View style={styles.cell}>
              <Text style={styles.text}>提交引航站</Text>
              <Text style={styles.text}>{model.SSYHZ}</Text>
            </View>
          </View>
          <View style={styles.row}>
            <View style={styles.cell}>
              <Text style={styles.text}>船况不良类型</Text>
            </View>
            <View style={styles.cell}>
              <Text style={styles.text}>{@_getType(model.CKLX)}</Text>
            </View>
          </View>
          <View style={styles.row}>
            <View style={styles.cell}>
              <Text style={styles.text}>审核日期</Text>
              <Text style={styles.text}>{moment(model.SHRQ).format('YYYY-MM-DD')}</Text>
            </View>
            <View style={styles.cell}>
            </View>
          </View>
        </View>
        <View style={[styles.row,{flex:10,marginBottom:40}]}>
          <WebView source={html:model.MS} style={{margin:5,height:500}}>
          </WebView>
        </View>
      </ScrollView>
    </View>


# <WebView html={model.MS} style={{margin:5,height:500}}>
{StyleSheet} = require('react-native')
styles = StyleSheet.create
  row:
    flexDirection:'row'
    borderWidth:1
    borderStyle:'solid'
    borderColor:'#CCCCCC'
    backgroundColor:'#ffffff'
    padding:10
    marginLeft:10
    marginRight:10
  cell:
    flex:1
    flexDirection:'row'
  text:
    flex:1

mapStateToProps = (state)->
  connected:state.appState.connected

{connect} = require('react-redux')
module.exports = connect(mapStateToProps)(Page_ckblbg_detail)
